Skip to content

feat(permissions): Add sorting feature for Users based on role#7654

Open
afsuyadi wants to merge 2 commits into
Flagsmith:mainfrom
afsuyadi:feat-sorting-users-role
Open

feat(permissions): Add sorting feature for Users based on role#7654
afsuyadi wants to merge 2 commits into
Flagsmith:mainfrom
afsuyadi:feat-sorting-users-role

Conversation

@afsuyadi
Copy link
Copy Markdown

@afsuyadi afsuyadi commented Jun 1, 2026

Thanks for submitting a PR! Please check the boxes below:

  • [✓] I have read the Contributing Guide.
  • [✓] I have added information to docs/ if required so people know about the feature.
  • [✓] I have filled in the "Changes" section below.
  • [✓] I have filled in the "How did you test this code" section below.

Changes

Contributes to #7613

Users in organisation, project, and environment permissions settings can now be sorted by role, making it easy to distinguish admisnitrators from standard users at a glance.

Each user is assigned a role rank for sorting:

  • Organisation Administrator (rank 0)
  • Project / Environment Administrator (rank 1)
  • Standard User (rank 2)

Sorting ASC puts administrators at the top; toggling reverses the order.

How did you test this code?

Tested manually on a local dev environment:

  1. Navigated to Users & Permissions tab
  2. Created users with different roles (Organisation Admin, Standard User)
  3. Clicked the Role sort button - confirmed admins grouped at the top, standard users at the bottom; toggling reversed the order
Screencast+from+01-06-26+14_56_46.mp4

@afsuyadi afsuyadi requested a review from a team as a code owner June 1, 2026 08:17
@afsuyadi afsuyadi requested review from talissoncosta and removed request for a team June 1, 2026 08:17
@vercel
Copy link
Copy Markdown

vercel Bot commented Jun 1, 2026

@afsuyadi is attempting to deploy a commit to the Flagsmith Team on Vercel.

A member of the Team first needs to authorize it.

@github-actions github-actions Bot added the front-end Issue related to the React Front End Dashboard label Jun 1, 2026
Copy link
Copy Markdown
Contributor

@gemini-code-assist gemini-code-assist Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

This pull request introduces role-based sorting for users in both the EditPermissions and OrganisationUsersTable components. The review feedback highlights a performance bottleneck in EditPermissions where an O(N * M) lookup is performed on every render; this can be optimized to O(N + M) by using a Set of admin user IDs. Additionally, the reviewer recommends defining the static sorting options arrays outside of both components to provide stable references and prevent breaking memoization in child components.

Comment thread frontend/web/components/EditPermissions.tsx
Comment thread frontend/web/components/EditPermissions.tsx
Comment thread frontend/web/components/EditPermissions.tsx Outdated
@vercel
Copy link
Copy Markdown

vercel Bot commented Jun 4, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
flagsmith-frontend-staging Ready Ready Preview, Comment Jun 5, 2026 12:05pm

Request Review

Copy link
Copy Markdown
Contributor

@talissoncosta talissoncosta left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for this @afsuyadi 🙏 Nice addition.

Could you go over the inline suggestions from Gemini Code Assist and address them? The main ones are hoisting the sort-option arrays to module scope (stable references so they don't break PanelSearch's memoisation) and the admin-lookup optimisation in EditPermissions.

Also, mind running npm run lint:fix and pushing the result? Wrapping the render prop in { … return ( … ) } left the JSX under-indented, so a format pass will tidy the diff.

Thanks!

@afsuyadi
Copy link
Copy Markdown
Author

afsuyadi commented Jun 4, 2026

Thanks for this @afsuyadi 🙏 Nice addition.

Could you go over the inline suggestions from Gemini Code Assist and address them? The main ones are hoisting the sort-option arrays to module scope (stable references so they don't break PanelSearch's memoisation) and the admin-lookup optimisation in EditPermissions.

Also, mind running npm run lint:fix and pushing the result? Wrapping the render prop in { … return ( … ) } left the JSX under-indented, so a format pass will tidy the diff.

Thanks!

Okay thanks, sure do 👍

@afsuyadi
Copy link
Copy Markdown
Author

afsuyadi commented Jun 5, 2026

Okay I have addressed the suggestions from Gemini Code Assistant and conducted the linting. Please inform me if there are more to be done. Thanks for the review @talissoncosta .

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

front-end Issue related to the React Front End Dashboard

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants